<template>
  <div class="user-wrapper" :class="theme">
    <!-- <span class="action">
      <a class="logout_title" target="_blank" href="http://www.jdd966.com">
        <a-icon type="question-circle-o"></a-icon>
      </a>
    </span>-->

    <span class="monitorButton action action-full" @click="answer" v-show="showAnswer">
      <img src="@/assets/monitor/call.gif" alt="" style="height:50px;" />{{updateLocalData}}
    </span>

<!--    <template v-if="isNotLebaOrSQAccount"> </template>-->
<!--    <span class="action" @click="switchRule(parkInfo)">
      <a-icon v-if="parkInfo.chargeMode === '1' || parkInfo.chargeMode === '0'" type="swap" />
      <span v-show="parkInfo.chargeMode === '1'">云端计费</span>
      <span v-show="parkInfo.chargeMode === '0'">场端计费</span>
    </span>-->

    <!-- <span class="monitorButton action action-full" @click="showMonitorPage">
      <img src="@/assets/monitor/monitor.png" alt="" />
      车场监控
    </span> -->
    <a-dropdown>
      <span class="action action-full ant-dropdown-link user-dropdown-menu">
        <a-avatar class="avatar" size="small" :src="getAvatar()" />
        <span v-if="isDesktop()">欢迎您，{{ nickname() }}</span>
      </span>
      <a-menu slot="overlay" class="user-dropdown-menu-wrapper">
        <a-menu-item key="3" @click="systemSetting">
          <a-icon type="tool" />
          <span>系统设置</span>
        </a-menu-item>
        <a-menu-item key="2" @click="updatePassword">
          <a-icon type="setting" />
          <span>密码修改</span>
        </a-menu-item>
      </a-menu>
    </a-dropdown>
    <span class="action">
      <a class="logout_title" href="javascript:" @click="handleLogout">
        <a-icon type="logout" />
        <span v-if="isDesktop()">&nbsp;退出登录</span>
      </a>
    </span>
    <user-password  @loginOut="loginOut" ref="userPassword"></user-password>

    <setting-drawer ref="settingDrawer" :closable="true" title="系统设置"></setting-drawer>
  </div>

</template>

<script>
import UserPassword from './UserPassword'
import SettingDrawer from '@/components/setting/SettingDrawer'

import DepartSelect from './DepartSelect'
import { mapActions, mapGetters } from 'vuex'
import { mixinDevice } from '@/utils/mixin.js'
import { startsWith } from 'lodash'
import { getAction, postAction} from '@/api/manage'
import store from '@/store'

export default {
  name: 'UserMenu',
  mixins: [mixinDevice],
  data() {
    return {
      showAnswer: false,
      websock: null,
      dataJson: null,
      parkInfo: [],
      url: {
        answer: '/equipment/deviceSeatAnswer/answer',
      },
    }
  },
  components: {
    UserPassword,
    DepartSelect,
    SettingDrawer,
  },
  props: {
    theme: {
      type: String,
      required: false,
      default: 'dark',
    },
  },

  destroyed () {
	    //页面销毁时关闭ws连接
	    // if(this.websock){
	    // 	this.websock.close() // 关闭websocket
	    // }
  	},
  computed: {
    /*isNotLebaOrSQAccount: function () {
      let username = this.userInfo().username
      return username != 'leba' && username != 'guosiqiang'
    },*/

    //获取推送消息内容
    updateLocalData(){
      this.dataJson = this.$store.getters.getLocalData;
      if(this.dataJson != null && this.dataJson.type == '2' && this.dataJson.state == '1'){
          this.showAnswer = true;
          location.href = "#/equipments/DeviceSeatAnswer";
         // this.$router.push('#/equipments/DeviceSeatAnswer');
        }else{
          this.showAnswer = false;
        }

      //return this.$store.getters.getLocalData;
    },

  },
  created() {
    // this.getparkInfo();
    // this.initWebSocket();
    // this.dataJson = JSON.parse(localStorage.getItem('dataJson'));

    //初始化websocket
    // this.initSocket();
  },
  methods: {

      //websocket初始化
      initSocket(){
          //var deviceid = this.$store.getters.deviceid;
          var deviceid = window.localStorage.getItem('deviceid');
          console.log('deviceid = ' + deviceid)
          this.$store.commit('initWebSocket',deviceid);
      },

    answer(){
      if (!this.url.answer) {
        this.$message.error('请设置url.answer属性!')
        return
      }

      //let params = JSON.parse(localStorage.getItem('dataJson'));
      let params = this.dataJson;
      if(params == null){
        this.$message.warning('请先呼叫设备');
      }
      postAction(this.url.answer, params).then((res) => {
        if (res.success) {
          this.showAnswer = false;
          this.$message.success('接听成功')
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
        this.loading = false
      })
    },

    getCallParams() {
      var param = Object.assign({}, this.queryParam)
      return filterObj(param)
    },

    showMonitorPage() {
      this.requestFullScreen();
      this.$router.push('/monitor');
    },
    requestFullScreen() {
      var docElm = document.documentElement;
      if (docElm.requestFullscreen) {
        docElm.requestFullscreen();
      } else if (docElm.msRequestFullscreen) {
        docElm.msRequestFullscreen();
      } else if (docElm.mozRequestFullScreen) {
        docElm.mozRequestFullScreen();
      } else if (docElm.webkitRequestFullScreen) {
        docElm.webkitRequestFullScreen();
      }
    },
    switchRule(parkInfo) {
      var that = this
      var chargeMode = parkInfo.chargeMode
      if (chargeMode === '1') {
        this.$confirm({
          title: '确认切换计费模式吗',
          content: '是否切换到场端计费模式?',
          onOk: function () {
            parkInfo.chargeMode = '0'
            postAction('/parking/parkInfo/editParkInfo', parkInfo).then((res) => {
              if (res.success) {
                that.$message.success(res.message)
              } else {
                that.$message.warning(res.message)
              }
            })
          },
        })
      }
      if (chargeMode === '0') {
        this.$confirm({
          title: '确认切换计费模式吗',
          content: '是否切换到云端计费模式?',
          onOk: function () {
            parkInfo.chargeMode = '1'
            postAction('/parking/parkInfo/editParkInfo', parkInfo).then((res) => {
              if (res.success) {
                that.$message.success(res.message)
              } else {
                that.$message.warning(res.message)
              }
            })
          },
        })
      }
    },

    getparkInfo() {
      getAction('/parking/parkInfo/getParkInfo').then((res) => {
        if (res.success) {
          if (res.result != null) {
            this.parkInfo = res.result
            if (res.result.chargeMode == '0') {
              this.parkInfo.chargeMode == '场端收费'
            }
            if (res.result.chargeMode == '1') {
              this.parkInfo.chargeMode == '云端收费'
            }
          }
        }
      })
    },

    ...mapActions(['Logout']),
    ...mapGetters(['nickname', 'avatar', 'userInfo']),
    getAvatar() {
      // console.log(this.avatar(), 'this.avatar()')
      return !!this.avatar()
        ? startsWith(this.avatar(), 'http')
          ? this.avatar()
          : window._CONFIG['domianURL'] + '/' + this.avatar()
        : ''
    },
    handleLogout() {
      const that = this

      this.$confirm({
        title: '提示',
        content: '真的要注销登录吗 ?',
        onOk() {
          that.loginOut()
        },
        onCancel() {
        }
      })
    },
    loginOut(){
      const that = this
      return that
        .Logout({})
        .then(() => {
          // window.location.href="/";
          window.location.reload()
          // console.log(window.location)
        })
        .catch(err => {
          that.$message.error({
            title: '错误',
            description: err.message
          })
        })
    },
    updatePassword() {
      let username = this.userInfo().username
      this.$refs.userPassword.show(username)
    },
    updateCurrentDepart() {
      this.$refs.departSelect.show()
    },
    systemSetting() {
      this.$refs.settingDrawer.showDrawer()
    },
    changeProject() {
        store.commit('SET_PROJECT_ID', 1)
    }


  },
}
</script>

<style scoped>
.logout_title {
  color: inherit;
  text-decoration: none;
}
.monitorButton:hover {
  background-color: #E7F3FE;
}

.monitorButton img {
  height: 64px;
}
</style>